<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="apple-touch-fullscreen" content="yes" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telphone=no, email=no" />
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="HandheldFriendly" content="true" />
    <meta name="MobileOptimized" content="480" />
    <meta name="screen-orientation" content="portrait" />
    <meta name="x5-orientation" content="portrait" />
    <title>发起申领申请</title>
</head>
<body>
<div class="page">
    <!-- 头部信息 -->
    <th:block th:include="include :: top"/>
    <div class="center">
        <div class="page-content page-wrap">
            <!-- 左侧导航 -->
            <th:block th:include="include :: left"/>
            <div class="page-wrap-container">

                <div class="claim-apply">
                    <div class="page-step">
                        <span class="current page-step1">填写证件号码</span>
                        <i class="fa fa-arrow-circle-right page-step1"></i>
                        <span class="page-step2">选择计划</span>
                        <i class="fa fa-arrow-circle-right page-step2"></i>
                        <span class="page-step3">选择保障期</span>
                        <i class="fa fa-arrow-circle-right page-step3"></i>
                        <span>上传资料</span>
                        <i class="fa fa-arrow-circle-right "></i>
                        <span>提交审核</span>
                    </div>

                    <div class="claim-select-step"><ul></ul></div>

                    <div class="page-form claim-step1">
                        <div class="page-form-item">
                            <div class="page-form-input">
                                <input type="text" style="width:200px" placeholder="证件号码" name="idCard" />
                            </div>

                            <div class="page-form-input">
                                <button class="layui-btn">下一步</button>
                            </div>
                        </div>
                    </div>
                    <div class="claim-select-list claim-step2">
                        <h2>请选择申请计划</h2>
                        <div class="claim-select-list-item"></div>
                    </div>
                    <div class="claim-select-list claim-step3">
                        <h2>请选择申请类别</h2>
                        <div class="claim-select-list-item"></div>
                    </div>
                    <!-- <div class="claim-select-list claim-step4">
                        <h2>请选择申请类别</h2>
                        <div class="claim-select-list-item"></div>
                    </div> -->
                </div>

            </div>
        </div>
    </div>
    <!-- 底部信息 -->
    <th:block th:include="include :: footer"/>
</div>

<script type="text/javascript">

    $(".claim-step1 .layui-btn").click(function () {
        var idCard = $(".claim-step1 input[name=idCard]").val();
        if (idCard == null || idCard == "") {
            layer.msg("请输入证件号码");
        } else {
            $.soon.ajax({
                url: "/hzclaim/hzClaimFront/getApplyInsurance",// 获取会员参加的活动
                data: { "idCard": idCard },
                success: function (step1) {
                    if (step1.success) {
                        var personId = step1.body.person.id; // 职工id
                        var personName = step1.body.person.name; // 职工姓名
                        var personIdCard = step1.body.person.idCard; // 职工身份证号
                        $(".claim-select-step ul").append('<li> <strong>已选择人员：</strong> ' + personName + ' [ ' + personIdCard + ' ] <i class="fa fa-check-circle"></i></li>');

                        var html1 = "";
                        for (var i = 0; i < step1.body.claims.length; i++) {
                            var item = step1.body.claims[i];
                            html1 += "<a data-id=" + item.insuranceId + ">" + item.insuranceName + "</a>";
                        }

                        $(".claim-step2 .claim-select-list-item").html(html1);
                        $(".claim-select-step").show();
                        $(".claim-step1").hide();
                        $(".claim-step2").show();
                        $(".page-step1").removeClass("current").addClass("complete");
                        $(".page-step2").addClass("current");

                        $(".claim-step2 .claim-select-list-item a").click(function () { // 获取会员参加活动的保障期
                            var insuranceId = $(this).attr("data-id"); // 计划id
                            var insuranceName = $(this).html(); // 计划名称
                            $.soon.ajax({
                                url: "/hzclaim/hzClaimFront/getApplyClaimDate",
                                data: {"insuranceId": insuranceId, "idCard": personIdCard},
                                success: function (step2) {
                                    if (step2.success) {
                                        $(".claim-select-step ul").append('<li> <strong>已选择计划：</strong> ' + insuranceName + ' <i class="fa fa-check-circle"></i></li>');
                                        var html2 = "";
                                        for (var i = 0; i < step2.body.claimInfos.length; i++) {
                                            var item = step2.body.claimInfos[i];
                                            html2 += "<a data-id=" + item.categoryId + " data-value=" + item.itemId + ">"+ item.categoryName + "</a>";
                                        }

                                        $(".claim-step3 .claim-select-list-item").html(html2);
                                        $(".claim-step2").hide();
                                        $(".claim-step3").show();
                                        $(".page-step2").removeClass("current").addClass("complete");
                                        $(".page-step3").addClass("current");

                                        $(".claim-step3 .claim-select-list-item a").click(function () {
                                            var categoryId = $(this).attr("data-id"); // 申领类别id
                                            var categoryName = $(this).html(); // 申领类别名称
                                            var itemId = $(this).attr("data-value"); // 入会单计划id

                                            var content = '<div style="padding:15px; line-height:30px;">';
                                            content += "	<p><strong style='color:red'>请核对信息是否正确，是否要发起申领申请</strong></p>";
                                            content += '	<p><strong>申请人：</strong>' + personName + ' [' + personIdCard + ']</p>';
                                            content += '	<p><strong>申请计划：</strong>' + insuranceName + '</p>';
                                            content += '	<p><strong>申领类别：</strong>' + categoryName + '</p>'
                                            content += '</div>';

                                            var idx = $.soon.open({
                                                width: "400px",
                                                height: "270px",
                                                title: "提交确认",
                                                content: content,
                                                btn: ["发起", "取消"],
                                                success: function () {
                                                    var idx1 = layer.load(0);
                                                    $.soon.ajax({
                                                        url: "/hzclaim/hzClaimFront/createClaimApply", // 发起申领
                                                        data: {
                                                            "categoryid": categoryId, // 申领类别id
                                                            "categoryName": categoryName, // 申领类别名称
                                                            "insuranceid": insuranceId, // 标准计划id-活动id
                                                            "insuranceName": insuranceName, // 标准计划名称-活动名称
                                                            "itemid": itemId, // 入会单计划id
                                                            "person.id": personId // 职工id
                                                        },
                                                        success: function (step3) {
                                                            if (step3.success) {
                                                                window.location = "/hzclaim/hzClaimFront/applyUploadClaim?id="+ step3.body.hzClaim.id;
                                                            } else {
                                                                layer.close(idx1);
                                                                layer.msg(step3.msg);
                                                            }
                                                        }
                                                    });

                                                }, end: function () {
                                                    layer.close(idx)
                                                }
                                            });
                                        });

                                    } else {
                                        layer.msg(step2.msg);
                                    }
                                }
                            });

                        });

                    } else {
                        layer.msg(step1.msg);
                    }
                }
            });
        }
    });

</script>

</body>
</html>
